<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
    String userid = request.getSession().getAttribute("user_id")==null?"":request.getSession().getAttribute("user_id").toString();
	String rolename = request.getSession().getAttribute("role_name") == null? "": request.getSession().getAttribute("role_name").toString();
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" type="text/css" href="../../bootstrap-3.3.7/dist/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../../bootstrap-3.3.7/dist/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/index.css" />
<link rel="stylesheet" type="text/css" href="../../css/infosearch.css" />
<link rel="stylesheet" type="text/css" href="../../css/background.css" />

<script type="text/javascript" src="../../bootstrap-3.3.7/dist/js/jquery.min.js"></script>
<script type="text/javascript" src="../../bootstrap-3.3.7/dist/js/bootstrap.js"></script>

<!-- bootstrap表格插件 -->
<script src="../../bootstrap-3.3.7/dist/js/bootstrap-table.js"></script>
<link href="../../bootstrap-3.3.7/dist/css/bootstrap-table.css" rel="stylesheet" />
<script src="../../bootstrap-3.3.7/dist/js/bootstrap-table-zh-CN.js"></script>
<script src="../../js/moment-with-locales.js"></script>
<script src="../../js/bootstrap-datetimepicker.min.js"></script>
<script src="../../js/bootstrap-datetimepicker.zh-CN.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="../../bootstrap-3.3.7/docs/assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<link rel="stylesheet" href="../../zTree/css/metroStyle/metroStyle.css" type="text/css">
<script type="text/javascript" src="../../js/browser.js"></script>
<script type="text/javascript" src="../../js/search/search.js"></script>
<script type="text/javascript" src="../../zTree/js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="../../zTree/js/jquery.ztree.excheck-3.5.js"></script>
<script type="text/javascript" src="../../zTree/js/jquery.ztree.exedit-3.5.js"></script>
</head>
<body>
	<div class="container">
		<input id="role" type="text" hidden="true">
		<input id="userid" type="text" hidden="true">
		<div class="row clearfix">
			<div class="col-md-12 column">
				<%@include file="../common/header.jsp"%>
			</div>
			<div class="col-md-12 column" style="padding-top: 20px">
				<div class="col-md-3 column" style="background-color: #F5FFFA">
					<h4 class="heading">类别</h4>
					<div class="myline"></div>
					<div class="panel panel-default" style="height: 800px">
						<ul id="treeDemo" class="ztree" style="background-color: #FFFFFF; border: 0px; overflow-y: auto; overflow-x: auto;"></ul>
					</div>
				</div>
				<div class="col-md-9 column">
					<div class="row" style="margin-top: 20px">
						<div class="panel panel-default" style="background-color: #CAE1FF; margin-left: 15px">
							<div style="margin-top: 10px; margin-left: 20px">
								<span style="font-size: 13px; font-weight: bold;">请输入检索条件:</span>
							</div>
							<input type="text" hidden="true" id="tag_name"> 
							<input type="text" hidden="true" id="time">
							<div class="panel-body" style="margin-left: 15px">
								<div class="row">
									<div class="col-md-2">
										<select id="category1" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="name">篇名</option>
											<option value="abstract">摘要</option>
											<option value="keyword">关键词</option>
											<option value="wh">文号</option>
										</select>
									</div>
									<div class="col-md-5">
										<input id="content1" type="text" class="form-control" style="height: 25px">
									</div>
									<div class="col-md-3">
										<select id="mode1" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="vogue">模糊检索</option>
											<option value="accurate">精确查找</option>
										</select>
									</div>
									<div class="col-md-2">
										<select id="andor2" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="and">并且</option>
											<option value="or">或者</option>
										</select>
									</div>
								</div>
								<div class="row" style="margin-top: 10px">
									<div class="col-md-2">
										<select id="category2" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="name">篇名</option>
											<option value="abstract">摘要</option>
											<option value="keyword">关键词</option>
											<option value="wh">文号</option>
										</select>
									</div>
									<div class="col-md-5">
										<input id="content2" type="text" class="form-control" style="height: 25px">
									</div>
									<div class="col-md-3">
										<select id="mode2" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="vogue">模糊检索</option>
											<option value="accurate">精确查找</option>
										</select>
									</div>
									<div class="col-md-2">
										<select id="andor3" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="and">并且</option>
											<option value="or">或者</option>
										</select>
									</div>
								</div>
								<div class="row" style="margin-top: 10px">
									<div class="col-md-2">
										<select id="category3" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="name">篇名</option>
											<option value="abstract">摘要</option>
											<option value="keyword">关键词</option>
											<option value="wh">文号</option>
										</select>
									</div>
									<div class="col-md-5">
										<input id="content3" type="text" class="form-control" style="height: 25px">
									</div>
									<div class="col-md-3">
										<select id="mode3" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="vogue">模糊检索</option>
											<option value="accurate">精确查找</option>
										</select>
									</div>
									<div class="col-md-2">
									    <input id="andor4" value="and" hidden="true" type="text" style="height: 25px">
									</div>
								</div>
								<div class="row" style="margin-top: 10px">
									<div class="col-md-2">
										<select id="category4" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="author">作者</option>
											<option value="firstauthor">第一作者</option>
										</select>
									</div>
									<div class="col-md-4">
										<input id="content4" type="text" class="form-control" style="height: 25px">
										<input id="mode4" value="vogue" hidden="true" type="text" style="height: 25px">
										<input id="andor5" value="and" hidden="true"type="text" style="height: 25px">
									</div>
									<div style="float: left; margin-left: 7px">
										<label class="control-label">作者单位</label>
									</div>
									<div class="col-md-3">
									    <input id="category5" value="company" hidden="true" type="text" style="height: 25px">
										<input id="content5" type="text" class="form-control" style="height: 25px">
									</div>
									<div class="col-md-2">
										<select id="mode5" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="vogue">模糊检索</option>
											<option value="accurate">精确查找</option>
										</select>
										<input id="andor6" value="and" hidden="true" type="text" style="height: 25px">
									</div>
								</div>
								<div class="row" style="margin-top: 10px">
									<div class="col-md-2">
										<div style="float: left">
											<label class="control-label">发布部门</label>
										</div>
									</div>
									<div class="col-md-5">
									    <input id="category6" value="bm" hidden="true" type="text" style="height: 25px">
										<input id="content6" type="text" class="form-control" style="height: 25px">
									</div>
									<div class="col-md-2">
										<select id="mode6" class="combobox" style="height: 25px; width: 100%; float: left">
											<option value="vogue">模糊检索</option>
											<option value="accurate">精确查找</option>
										</select>
										<input id="andor7" value="and" hidden="true" type="text" style="height: 25px">
									</div>
								</div>
								<div class="row" style="margin-top: 10px">
									<div class="col-md-2">
										<div style="float: left">
											<label class="control-label">发布时间</label>
										</div>
										<input id="category7" value="time" hidden="true" type="text" style="height: 25px">
										<input id="category8" value="time" hidden="true" type="text" style="height: 25px">
										<input id="mode7" value="add" hidden="true" type="text" style="height: 25px">
										<input id="mode8" value="minus" hidden="true" type="text" style="height: 25px">
										<input id="andor8" value="and" hidden="true" type="text" style="height: 25px">
										<input id="andor9" value="and" hidden="true" type="text" style="height: 25px">
									</div>
									<div class="col-md-2">
										<a class='input-group date' id='datetimestart'> <input type='text' class="form-control" id='content7' style="height: 25px" /> <span class="input-group-addon"
											style="width: 50px;"> <span class="glyphicon glyphicon-calendar"></span>
										</span>
										</a>
									</div>
									<div style="float: left">--</div>
									<div class="col-md-2">
										<a class='input-group date' id='datetimeend'> <input type='text' class="form-control" id='content8' style="height: 25px" /> <span class="input-group-addon"
											style="width: 50px;"> <span class="glyphicon glyphicon-calendar"></span>
										</span>
										</a>
									</div>
									<div style="float: left">
										<div style="float: left">
											<label class="control-label">更新时间</label>
										</div>
										<input id="category9" value="uptime" hidden="true" type="text" style="height: 25px">
									</div>
									<div class="col-md-2">
										<select id="content9" class="combobox" style="height: 25px;">
											<option value="nolimit">不限</option>
											<option value="week">近一周</option>
											<option value="month">近一个月</option>
											<option value="halfyear">近半年</option>
											<option value="oneyear">近一年</option>
										</select>
										<input id="mode9" value="accurate" hidden="true" type="text" style="height: 25px">
										<input id="andor1" value="and" hidden="true" type="text" style="height: 25px">
									</div>
									<div class="col-md-2"></div>
									<div class="col-md-2">
										<button id="btn_query" type="button" class="btn btn-warning" style="height: 27px;">
											<span class="myfont" style="padding-bottom:10px">检索</span>
										</button>
									</div>
								</div>
							</div>
						</div>
					</div>
					<ul id="myTab" class="nav nav-tabs" style="background-color: #F5FFFA">

					</ul>
					<div class="panel panel-default">
						<div id="myTabContent" class="tab-content"></div>
						<div class="myline"></div>
					</div>
					<div style="margin-top: 0px">
						<table id="tb_departments"></table>
					</div>
				</div>
			</div>
		</div>
		<div class="row clearfix">
			<div class="col-md-3 column"></div>
		</div>

		<div class="row clearfix">
			<div class="col-md-12 column">
				<%@include file="../common/bottom.jsp"%>
			</div>
		</div>
	</div>
	
	
	<div class="modal fade" id="sendEmail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">请输入您要发送的邮箱</h4>
				</div>
				<div class="modal-body">
					<input id="toemail" name="toemail" type="text" class="form-control"> 
					<input id="name" name="name" type="text" hidden="true"> 
					<input id="url" name="url" type="text" hidden="true">
					<input id="currentTab" name="currentTab" type="text" hidden="true">
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary" onclick="send()">发送</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
	</div>
</body>
<script type="text/javascript">
	//zTree树的参数
	var jstring;
	var role='<%=rolename%>';
	var userid='<%=userid%>';
	var setting = {
		data : {
			simpleData : {
				enable : true
			}
		},
		view : {
			showLine : false,
			showIcon : false,
			checkable : true
		},
		check : {
			enable : true
		}
	};
	
	//zTree树的初始化
	function treeinit(){
		var treeNode=[];
		$.ajax({
			async : false,
			cache : false,
			type : 'POST',
			dataType : "json",
			url : "../configration/getReczsk",
			error : function() {
				alert('请求失败');
			},
			success : function(data) {
				treeNode = data;
			}
		});
		var tree=$.fn.zTree.init($("#treeDemo"), setting, treeNode);
		tree.expandAll(true);
		/* tree.checkAllNodes(true); */
	}
	
	//BootStrap初始化
	$(function() {
		$("#role").val(role);
		$("#userid").val(userid);
		 treeinit();
		//1.初始化Table
		jstring = getjstring();
		var oTable = new TableInit();
		oTable.Init();

		//2.初始化Button的点击事件
		var oButtonInit = new ButtonInit();
		oButtonInit.Init();
		datetime();
		//标签初始化
		changeTag("");
		decorate();

	});

	var TableInit = function() {
		var oTableInit = new Object();
		//初始化Table
		oTableInit.Init = function() {
			$('#tb_departments')
					.bootstrapTable(
							{
								url : '../information/getADSearchInformation', //请求后台的URL（*）
								method : 'get', //请求方式（*）
								toolbar : '#toolbar', //工具按钮用哪个容器
								striped : true, //是否显示行间隔色
								cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
								pagination : true, //是否显示分页（*）
								sortable : true, //是否启用排序
								sortOrder : "asc", //排序方式
								queryParams : oTableInit.queryParams,//传递参数（*）
								sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
								pageNumber : 1, //初始化加载第一页，默认第一页
								pageSize : 10, //每页的记录行数（*）
								/*            pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
								 */search : false, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
								strictSearch : true,
								showColumns : false, //是否显示所有的列
								showRefresh : false, //是否显示刷新按钮
								minimumCountColumns : 2, //最少允许的列数
								clickToSelect : true, //是否启用点击选中行
								height : 650, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
								uniqueId : "ID", //每一行的唯一标识，一般为主键列
								showToggle : false, //是否显示详细视图和列表视图的切换按钮
								cardView : false, //是否显示详细视图
								detailView : false, //是否显示父子表
								columns : [
										{
											field : 'info_name',
											title : '题名',
											width : '33%',
											formatter : function(value,row,index) {
												var element = "<a onclick='check(\""+row.info_id+"\",\""+row.info_keyword+"\")' data-id='"+ row.info_id+ "'><span class='text-primary'>"+ row.info_name+ "</span></a>&nbsp;&nbsp";

												return element;
											}
										},
										{
											field : 'info_author',
											title : '作者',
											width : '13%'
										},
										{
											field : 'info_bm',
											title : '发布部门',
											width : '12%'
										},
										{
											field : 'info_time',
											title : '发布时间',
											width : '12%'
										},
										{
											field : 'library',
											title : '库',
											width : '10%'
										},
										{
											field : 'info_download',
											title : '下载',
											width : '5%'
										},
										{
											field : 'info_browser',
											title : '浏览',
											width : '5%'
										},
										{
											field : 'operate',
											title : '操作',
											width : '10%',
											formatter : function(value, row,
													index) {
												var element;
												element = '<img id="collectimage" class="img-thumbnail" onclick="down(\''+row.info_url+'\',\''+row.info_id+'\',\''+row.info_status+'\',\''+row.info_level+'\')" data-toggle="popover" data-trigger="hover" title="下载" style="height: 25px; width: 25px; border: none;margin-left:5px" src="../../image/icon/download.png">'
/* 													+'<img id="emailimage"  onclick="moopen(\''+ row.info_url+ '\',\''+row.info_name+'\',\''+row.info_level+'\')"  class="img-thumbnail" data-toggle="popover" data-trigger="hover" title="发送到邮箱" style="height: 25px; width: 25px; border: none; float: left" src="../../image/icon/mail.png">'
 */													return element;
											}
										}]
							});
		};
		//得到查询的参数
		oTableInit.queryParams = function(params) {
			var reczsk_id = getReczskIDS();
			//console.log(jstring);
			
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				limit : params.limit, //页面大小
				offset : params.offset, //页码初始开始值
				jstring : jstring,
				reczsk_id : reczsk_id,
				tag_name : $("#tag_name").val(),
				time : $("#time").val()
			};
			//console.log(JSON.stringify(temp));
			return temp;
		};
		return oTableInit;
	};

	var ButtonInit = function() {
		var oInit = new Object();
		oInit.Init = function() {
			//初始化页面上面的按钮事件
			$('#btn_query').bind('click', function() {
				$("#tag_name").val("");
				$("#time").val("");
				jstring = getjstring(); 
				$('#tb_departments').bootstrapTable('refreshOptions',{pageNumber:1});
				var reczsk_id = getReczskIDS();
				changeTag(reczsk_id);
				decorate();
			});
		};

		return oInit;
	};
	
	function getjstring() {
		var jstring = "[";
		for (var i = 1; i < 10; i++) {
			jstring = jstring + '{"category":"' + $("#category" + i + "").val()
					+ '","content":"' + $("#content" + i + "").val()
					+ '","mode":"' + $("#mode" + i + "").val() + '","andor":"'
					+ $("#andor" + i + "").val() + '"}';
					if(i!=9)jstring = jstring +",";
		}	
		
		jstring = jstring + "]";
		return jstring;
	}
	function changeTag(reczsk_id) {
		$.ajax({
			async : false,
			cache : false,
			type : 'POST',
			dataType : "json",
			data : {
				reczsk_id : reczsk_id,
				jstring : jstring,
				tag_name : $("#tag_name").val(),
				time : $("#time").val()
			},
			url : "../information/updateAdSearchTag",
			error : function() {
				alert('请求失败');
			},
			success : function(data) {
				taglist = data;
				initTab(taglist);
			}
		});//AJAX结束
	}
	
	function moopen(url,name){
		var userid = '<%=userid%>';
		
		if(userid==""){
			window.location.href="../common/login.jsp";
		}
		else{
			var modal = $("#sendEmail");
			modal.modal("show");
			modal.find('#name').val(name);
			modal.find('#url').val(url);
		}
		
	}
	
	function datetime() {
		$('#datetimestart').datetimepicker({
			language : 'zh-CN',//显示中文
			format : 'yyyy',//显示格式
			startView : 4,//打开之后首先选择的视图
			minView : 4,//设置只显示到月份
			initialDate : new Date(),
			autoclose : false,//选中自动关闭
			todayBtn : true,//显示今日按钮
			todayHighlight : true,
			locale : moment.locale('zh-cn')
		});
		$('#datetimeend').datetimepicker({
			language : 'zh-CN',//显示中文
			format : 'yyyy',//显示格式
			startView : 4,//打开之后首先选择的视图
			minView : 4,//设置只显示到月份
			initialDate : new Date(),
			autoclose : false,//选中自动关闭
			todayBtn : true,//显示今日按钮
			todayHighlight : true,
			locale : moment.locale('zh-cn')
		});
	}
</script> 
</html>